<script setup lang="tsx">
import { PropType, ref, unref, nextTick } from 'vue'
import { Descriptions, DescriptionsSchema } from '@/components/Descriptions'
import { useValidator } from '@/hooks/web/useValidator'
import { getTreeDepartmentsApi } from '@/api/department'
import { useI18n } from '@/hooks/web/useI18n'
import { getStationsApi } from '@/api/role'
import { ElForm, ElFormItem, ElInput, ElButton } from 'element-plus'
const { required } = useValidator()
const { t } = useI18n()
const options = defineProps({
  currentRow: {
    type: Object as PropType<any>,
    default: () => undefined
  },
  type: {
    type: String,
    default: () => undefined
  }
  //   ,
  //   remark: {
  //     type: String,
  //     default: () => undefined
  //   }
})
console.log('options-----------', options.type)
const detailSchema = ref<DescriptionsSchema[]>([
  {
    field: 'fileName',
    label: t('common.fileName')
    // slots: {
    //   default: ({ row }: any) => {
    //     const workTypeColor = row.workTypeColor || '#000'
    //     const style = { color: workTypeColor }
    //     return <>{workTypeColor ? <span style={style}>{row.fileName}</span> : row.fileName}</>
    //   }
    // }
  },
  {
    field: 'stationName',
    label: '采集站',
    sortable: true
  },
  {
    field: 'depName',
    label: '部门',
    sortable: true
  },

  {
    field: 'userName',
    label: '用户',
    sortable: true
  },
  {
    field: 'deviceNo',
    label: '设备编号',
    sortable: true
  },

  {
    field: 'fileTime',
    label: '拍摄时间',
    sortable: true
  },
  {
    field: 'collectTime',
    label: '采集时间',
    sortable: true
  },
  {
    field: 'uploadFileTime',
    label: '上传时间',
    sortable: true
  },
  // {
  //   field: 'fileTimeSpan',
  //   label: '时长',
  //   sortable: true,
  //   hidden: options.type == '2',
  //   slots:
  //     options.type == '2'
  //       ? ''
  //       : {
  //           default: (row: any) => {
  //             console.log('------', row)
  //             const totalSeconds = row.fileTimeSpan
  //             const hours = Math.floor(totalSeconds / 3600)
  //             const remainingSeconds = totalSeconds % 3600
  //             const minutes = Math.floor(remainingSeconds / 60)
  //             const seconds = remainingSeconds % 60

  //             // 格式化输出为 "HH:MM:SS" 格式
  //             const formattedHours = hours.toString().padStart(2, '0')
  //             const formattedMinutes = minutes.toString().padStart(2, '0')
  //             const formattedSeconds = seconds.toString().padStart(2, '0')
  //             return <span>{`${formattedHours}:${formattedMinutes}:${formattedSeconds}`}</span>
  //           }
  //         }
  // },
  {
    field: 'fileLength',
    label: '大小(MB)',
    sortable: true,
    slots: {
      default: (row: any) => {
        return <span>{parseFloat((row.fileLength / 1024 / 1024).toFixed(2)) || '--'}</span>
      }
    }
  },
  // {
  //   field: 'downloadCount',
  //   label: '下载次数',
  //   sortable: true
  // },
  {
    field: 'browseCount',
    label: '浏览次数',
    sortable: true
  },
  {
    field: 'remark',
    label: '备注',
    rowspan: 2,
    slots: {
      default: (row: any) => {
        return <ElInput v-model={row.remark} type="textarea" />
      }
    }
  }
])

// const { formRegister, formMethods } = useForm()
// const { setValues, getFormData, getElFormExpose } = formMethods

// const submit = async () => {
//   const elForm = await getElFormExpose()
//   const valid = await elForm?.validate().catch((err) => {
//     console.log(err)
//   })
//   if (valid) {
//     const formData = await getFormData()
//     return formData
//   }
// }
const content = ref('')
</script>

<template>
  <Descriptions :schema="detailSchema" :data="currentRow || {}" />
  <!-- <ElForm label-width="auto" style="max-width: 600px">
    <ElFormItem label="别名">
      <ElInput v-model="content" />
    </ElFormItem>
  </ElForm> -->
</template>
<style scoped>
:deep(.el-input__inner) {
  text-align: start !important;
}
</style>
